<template>
    <div>
        <Form :label-width="100" inline>
            <Form-item label="推送状态">
                <dictSelect :sel_val='queryParam.mpld0001' dictCode="mpld0001" :bindData.sync="queryParam.mpld0001"
                            style="width: 200px"/>
            </Form-item>
            <Form-item label="姓名">
                <Input v-model="queryParam.mpps0008" placeholder="请输入姓名" style="width: 200px"/>
            </Form-item>
            <Form-item label="证件号码">
                <Input v-model="queryParam.mpps0009" placeholder="请输入证件号码" style="width: 200px"/>
            </Form-item>
            <Row class="button_row">
                <span style="float: right;">
                 <Button type="primary" @click="searchQuery">查询</Button>
                 <Button type="primary" class="button_item_left" @click="searchReset">重置</Button>
                </span>
            </Row>
        </Form>

        <div class="table_div">
            <Table :columns="columns" :data="tableData" :loading="Loading">
                <template slot-scope="{ row }" slot="action">
                    <Button v-if="row.mpld0001!=0 && row.mpld0001!=1" type="info" size="small" style="margin-right: 5px" @click="showRemarks(row)">查看异常</Button>
                    <Button  type="success" size="small" style="margin-right: 5px" @click="handleError(row)">处理异常</Button>
                </template>
            </Table>
            <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                  @on-change="handleTableChange" :current="pageNo"></Page>
        </div>
        <Modal v-model="detailModal" title="推送详细信息" width="1000" style="position:relative;">
            <div>
                <Table :columns="detailColumns" :data="detailInfoData" :loading="Loading">
                </Table>
                <Page :total="dataCountDetail" :page-size="pageSize"  class="paging"
                      @on-change="handleTableChangeV"></Page>
            </div>
            <div slot="footer">
<!--                <Button type="text" size="large" @click="detailModal = false">关闭</Button>-->
               <br />
            </div>
        </Modal>
        <Modal v-model="remarksModal" title="异常详细信息" width="500" style="position:relative;">
            <div >
                <Input v-model="remarks" type="textarea" :max-length="100" :autosize="{minRows: 5,maxRows: 10}" width="450" disabled/>
            </div>
            <div slot="footer">
            </div>
        </Modal>
    </div>
</template>

<script>
    import {postAction} from '@/api/request'
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import dictSelect from '@/components/dictSelect/dictSelect.vue'
    import DateFormat from '@/plugins/format.js'

    export default {
        mixins: [CommonMixin],
        components: {
            dictSelect
        },
        data() {
            return {
                columns: [
                    {
                        title: '推送日期',
                        key: 'create_date',
                        render: (h, params) => {
                            let value = params.row.create_date
                            if (typeof (value) === 'undefined' || value === null || value === '' || value === undefined) {
                                value = '--'
                            } else {
                                value = DateFormat(value, 'YYYY-MM-DD')
                            }
                            return h('span', value + ' ')
                        }
                    },
                    {
                        title: '推送状态',
                        key: 'mpld0001_name'
                    },
                    {
                        title: '成功总数量',
                        key: 'mpld0002',
                        align: 'center'
                    },
                    {
                        title: '新增数量',
                        key: 'mpld0003',
                        render: (h, params) => {
                            return h('div', [
                                h('a', {
                                    on: {
                                        click: () => {
                                            this.handleDetail(params.row, '1')
                                        }
                                    }
                                }, params.row.mpld0003)
                            ])
                        },
                        align: 'center'
                    },
                    {
                        title: '更新数量',
                        key: 'mpld0004',
                        render: (h, params) => {
                            return h('span', [
                                h('a', {
                                    on: {
                                        click: () => {
                                            this.handleDetail(params.row, '2')
                                        }
                                    }
                                }, params.row.mpld0004)
                            ])
                        },
                        align: 'center'
                    },
                    {
                        title: '停救数量',
                        key: 'mpld0005',
                        render: (h, params) => {
                            return h('span', [
                                h('a', {
                                    on: {
                                        click: () => {
                                            this.handleDetail(params.row, '3')
                                        }
                                    }
                                }, params.row.mpld0005)
                            ])
                        },
                        align: 'center'
                    },
                    {
                    title: '异常数量',
                    key: 'mpld0006',
                    render: (h, params) => {
                      return h('span', [
                        h('a', {
                          on: {
                            click: () => {
                              this.handleDetail(params.row, '0')
                            }
                          }
                        }, params.row.mpld0006)
                      ])
                    },
                    align: 'center'
                  },
                  {
                    title: '延迟数据执行',
                    key: 'mpld0007',
                    render: (h, params) => {
                      return h('span', [
                        h('a', {
                          on: {
                            click: () => {
                              this.handleDetail(params.row, '4')
                            }
                          }
                        }, params.row.mpld0006)
                      ])
                    },
                    align: 'center'
                  },
                  {
                    title: '操作',
                    key: 'action',
                    align: 'center',
                    slot: 'action',
                    width: 200
                  }
                ],
                detailColumns: [
                    {
                        title: '身份证号',
                        key: 'mpps0008',
                        align: 'center',
                        width: '200px',
                    },
                    {
                        title: '姓名',
                        key: 'mpps0009',
                        align: 'center',
                        width: '100px',
                    },
                    {
                        title: '保障标识',
                        key: 'mpps0010',
                        width: '150px',
                        align: 'center'
                    },
                    {
                        title: '操作内容',
                        key: 'mpps0011',
                        align: 'center'
                    },
                ],
                tableData: [],
                dataParamDetail:{},
                detailModal: false,
                remarksModal: false,
                detailInfoData: [],
                dataCountDetail: 0,
                Loading: false,
                remarks:'',
                url: {
                    list: "/api/ac/subsistence/ss00004Service/getExchangePageList",
                    detailList: "/api/ac/subsistence/ss00004Service/getDetailPageList",
                    fix:"/api/ac/subsistence/ss00004Service/createFixError",
                },
                formData: {
                    cfab0001: '',
                    cfab0002: '',
                    cfab0003: '',
                    cfab0004: '',
                    cfab0005: '',
                    cfab0006: '',
                    cfab0009: '',
                    cfab0010: ''
                },
                queryParam: {},
                visible: false,
                showSubmit: true,
                dataCount: 0,
                pageSize: 10,
                modal: false,
                title: ""
            }
        },
        methods: {
            handleTableChangeV(index) {
                let that = this;
                let url = that.url.detailList
                var dataParam = {
                    pageNo : index,
                    mpps0007: that.dataParamDetail.mpps0007,
                    mpps0099: that.dataParamDetail.mpps0099
                }
                postAction(url, dataParam).then((res) => {
                    if (res.data.errcode != 0) {
                        that.$Message.error(res.data.errmsg);
                    } else {
                        that.detailInfo = true;
                        that.detailInfoData = res.data.data.results;
                        that.dataCountDetail = res.data.data.totalRecord;
                    }
                }).finally(() => {
                    that.Loading = false;
                });
            },
            handleDetail(row, type) {
                let that = this;
                that.detailInfoData = [];
                that.dataCountDetail = 0;
                that.detailModal = true;
                let mpps0007 = type;
                let mpps0099 = row.id;
                let url = that.url.detailList
                that.dataParamDetail = {mpps0007: mpps0007, mpps0099: mpps0099}
                postAction(url, that.dataParamDetail).then((res) => {
                    if (res.data.errcode != 0) {
                        that.$Message.error(res.data.errmsg);
                    } else {
                        that.detailInfo = true;
                        that.detailInfoData = res.data.data.results;
                        that.dataCountDetail = res.data.data.totalRecord;
                    }
                }).finally(() => {
                    that.Loading = false;
                });
            },
          showRemarks(row){
            this.remarks='';
            this.remarks=row.remarks;
            this.remarksModal=true;
          },
          handleError(row){
            let that = this;
            let url = that.url.fix
            that.param = {mpld0001: row.mpld0001,id:row.id}
            postAction(url, that.param).then((res) => {
              if (res.data.errcode == 0) {
                that.$Message.error(res.data.errmsg);
              } else {
                that.$Message.success("异常数据处理成功");
                this.loadData();
              }
            }).finally(() => {
              that.Loading = false;
            });
          }
        },
        created() {
            this.loadData();
        },
    }
</script>
<style scoped>
    .paging {
        float: right;
        margin-top: 10px;
    }

    /deep/ .ivu-upload-list {
        display: none;
    }
</style>
